<template>
  <div>
    <div class="filter-bar">
      <div>
        <a-space>
          <my-tree-select
            class="orgSelect"
            ref="myTree"
            :tree-data="orgTree"
            :value="treeValue"
            placeholder="请选择所属组织"
            :replaceFields="{
              children: 'children',
              title: 'name',
              key: 'id',
              value: 'id',
            }"
            @selectChange="selectChange"
          />
          <a-select allowClear style="width: 150px" v-model="searchForm.appId" placeholder="全部应用">
            <a-select-option :value="item.id" v-for="item in appList" :key="item.id">
              {{ item.appName }}
            </a-select-option>
          </a-select>
          <a-range-picker valueFormat="YYYY-MM-DD" v-model="searchForm.date" style="width: 250px">
            <a-icon slot="suffixIcon" type="calendar" />
          </a-range-picker>
          <a-button
            class="nbcs-btn nbcs-btn-search"
            @click="
              getSearch();
            "
            >查询
          </a-button>
        </a-space>
      </div>
      <div>
        <a-button class="nbcs-btn-main-bg" @click="exportData" :loading="exportLoading"> 导出 </a-button>
      </div>
    </div>
    <a-row style="margin-top: 17px" :gutter="10">
      <a-col :xs="8" :sm="8" :md="8" :lg="6" :xl="4">
        <bigdata-card :count="cutStat(headerStat.taskTotalCount).number" :unit="cutStat(headerStat.taskTotalCount).unit" units="个" title="任务总数" :bgImg="require('@/assets/img/rwzs.png')" :mark="require('@/assets/img/rwzs-mark.png')"></bigdata-card>
      </a-col>
      <a-col :xs="8" :sm="8" :md="8" :lg="6" :xl="4">
        <bigdata-card :count="cutStat(headerStat.wordsTotalCount).number" :unit="cutStat(headerStat.wordsTotalCount).unit" units="字" title="文字检测总量" :bgImg="require('@/assets/img/wzsh.png')" :mark="require('@/assets/img/wzsh-mark.png')"></bigdata-card>
      </a-col>
      <a-col :xs="8" :sm="8" :md="8" :lg="6" :xl="4">
        <bigdata-card :count="cutStat(headerStat.imgTotalCount).number" :unit="cutStat(headerStat.imgTotalCount).unit" units="张" title="图片检测总量" :bgImg="require('@/assets/img/tpsh.png')" :mark="require('@/assets/img/tpsh-mark.png')"></bigdata-card>
      </a-col>
      <a-col :xs="8" :sm="8" :md="8" :lg="6" :xl="4">
        <bigdata-card :count="cutStat(headerStat.videoTotalCount).number" :unit="cutStat(headerStat.videoTotalCount).unit" units="段" title="视频检测总量" :bgImg="require('@/assets/img/spsh.png')" :mark="require('@/assets/img/spsh-mark.png')"></bigdata-card>
      </a-col>
      <a-col :xs="8" :sm="8" :md="8" :lg="6" :xl="4">
        <bigdata-card :count="cutStat(headerStat.audioTotalCount).number" :unit="cutStat(headerStat.audioTotalCount).unit" units="段" title="音频检测总量" :bgImg="require('@/assets/img/ypsh.png')" :mark="require('@/assets/img/ypsh-mark.png')"></bigdata-card>
      </a-col>
      <a-col :xs="8" :sm="8" :md="8" :lg="6" :xl="4">
        <bigdata-card :count="cutStat(headerStat.violationTotalCount).number" :unit="cutStat(headerStat.violationTotalCount).unit" units="处" title="违规风险总量" :bgImg="require('@/assets/img/wgzl.png')" :mark="require('@/assets/img/wgzl-mark.png')"></bigdata-card>
      </a-col>
    </a-row>
    <!-- 检测统计 -->
    <div class="shtj">
      <div class="shtj-header">
        <div class="title">检测统计</div>
        <a-divider style="margin-left: 16px;margin-right: 18px" type="vertical" />
        <chart-tabs
          @selectTab="selectTab"
          :tabList="[
            { key: 'text', name: '文本检测情况' },
            { key: 'image', name: '图片检测情况' },
            { key: 'audio', name: '音频检测情况' },
            { key: 'video', name: '视频检测情况' },
            { key: 'doc', name: '文档检测情况' },
          ]"
        ></chart-tabs>
      </div>
      <div class="shtj-middle">
        <template v-if="checkTab=='text'">
          <a-space>
            <a-select @change="typeChange" class="l-float" style="width: 150px" v-model="textSelect">
              <a-select-option value="1">检测任务数</a-select-option>
              <a-select-option value="2">检测字数</a-select-option>
              <a-select-option value="3">违规风险数</a-select-option>
            </a-select>
            <a-button
              v-if="barType == 'day'"
              class="nbcs-btn nbcs-btn-main"
              @click="backToMonth()">返回
            </a-button>
          </a-space>
          <div style="display: flex;">
            <div>
              <span class="name">问题数占比：</span>
              <span class="count">{{ (summaryStat.textViolationPercent * 100).toFixed(1) + '%' }}</span>
            </div>
            <div>
              <span class="name" style="margin-left: 20px">累计文本任务数：</span>
              <span class="count">{{ summaryStat.textTaskCount }}</span>
              <span class="name">个</span>
            </div>
            <div style="margin-left: 20px">
              <span class="name">累计文本任务占比：</span>
              <span class="count">{{ (summaryStat.textPercent * 100).toFixed(1) + '%' }}</span>
            </div>

          </div>
        </template>
        <template v-else-if="checkTab=='image'">
          <a-space>
            <a-select @change="typeChange" class="l-float" style="width: 150px" v-model="imgSelect">
              <a-select-option value="1">检测任务数</a-select-option>
              <a-select-option value="2">检测字数</a-select-option>
              <a-select-option value="3">检测图片数</a-select-option>
              <a-select-option value="4">违规风险数</a-select-option>
            </a-select>
            <a-button
              v-if="barType == 'day'"
              class="nbcs-btn nbcs-btn-main"
              @click="backToMonth()">返回
            </a-button>
          </a-space>
          <div style="display: flex;">
            <div>
              <span class="name">问题数占比：</span>
              <span class="count">{{ (summaryStat.imgViolationPercent * 100).toFixed(1) + '%' }}</span>
            </div>
            <div style="margin-left: 20px">
              <span class="name">累计图片任务数：</span>
              <span class="count">{{ summaryStat.imgTaskCount }}</span>
            </div>
            <div style="margin-left: 20px">
              <span class="name">累计图片任务占比：</span>
              <span class="count">{{ (summaryStat.imgPercent * 100).toFixed(1) + '%' }}</span>
            </div>
          </div>
        </template>
        <template v-else-if="checkTab=='audio'">
          <a-space>
            <a-select @change="typeChange" class="r-float" style="width: 150px" v-model="audioSelect">
              <a-select-option value="1">检测任务数</a-select-option>
              <a-select-option value="2">检测字数</a-select-option>
              <a-select-option value="3">检测长度</a-select-option>
              <a-select-option value="4">违规风险数</a-select-option>
            </a-select>
            <a-button
              v-if="barType == 'day'"
              class="nbcs-btn nbcs-btn-main"
              @click="backToMonth()">返回
            </a-button>
          </a-space>
          <div style="display: flex;">
            <div>
              <span class="name">问题数占比：</span>
              <span class="count">{{ (summaryStat.audioViolationPercent * 100).toFixed(1) + '%' }}</span>
            </div>
            <div>
              <span class="name" style="margin-left: 20px">累计音频任务数：</span>
              <span class="count">{{ summaryStat.audioTaskCount }}</span>
              <span class="name">个</span>
            </div>
            <div style="margin-left: 20px">
              <span class="name">累计音频任务占比：</span>
              <span class="count">{{ (summaryStat.audioPercent * 100).toFixed(1) + '%' }}</span>
            </div>
          </div>
        </template>
        <template v-else-if="checkTab=='video'">
          <a-space>
            <a-select @change="typeChange" class="l-float" style="width: 150px" v-model="videoSelect">
              <a-select-option value="1">检测任务数</a-select-option>
              <a-select-option value="2">检测字数</a-select-option>
              <a-select-option value="3">检测长度</a-select-option>
              <a-select-option value="4">违规风险数</a-select-option>
            </a-select>
            <a-button
              v-if="barType == 'day'"
              class="nbcs-btn nbcs-btn-main"
              @click="backToMonth()">返回
            </a-button>
          </a-space>
          <div style="display: flex;">
            <div>
              <span class="name">问题数占比：</span>
              <span class="count">{{ (summaryStat.videoViolationPercent * 100).toFixed(1) + '%' }}</span>
            </div>
            <div>
              <span class="name" style="margin-left: 20px">累计视频任务数：</span>
              <span class="count">{{ summaryStat.videoTaskCount }}</span>
              <span class="name">个</span>
            </div>
            <div style="margin-left: 20px">
              <span class="name">累计视频任务占比：</span>
              <span class="count">{{ (summaryStat.videoPercent * 100).toFixed(1) + '%' }}</span>
            </div>
          </div>
        </template>
        <template v-else-if="checkTab=='doc'">
          <a-space>
            <a-select @change="typeChange" class="r-float" style="width: 150px" v-model="fileSelect">
              <a-select-option value="1">检测任务数</a-select-option>
              <a-select-option value="2">检测字数</a-select-option>
              <a-select-option value="3">检测图片</a-select-option>
              <a-select-option value="4">违规风险数</a-select-option>
            </a-select>
            <a-button
              v-if="barType == 'day'"
              class="nbcs-btn nbcs-btn-main"
              @click="backToMonth()">返回
            </a-button>
          </a-space>
          <div style="display: flex;">
            <div>
              <span class="name">问题数占比：</span>
              <span class="count">{{ (summaryStat.docViolationPercent * 100).toFixed(1) + '%' }}</span>
            </div>
            <div>
              <span class="name" style="margin-left: 20px">累计文档任务数：</span>
              <span class="count">{{ summaryStat.docTaskCount }}</span>
              <span class="name">个</span>
            </div>
            <div style="margin-left: 20px">
              <span class="name">累计文档任务占比：</span>
              <span class="count">{{ (summaryStat.docPercent * 100).toFixed(1) + '%' }}</span>
            </div>
          </div>
        </template>
      </div>
      <div class="shtj-chart position-r">
        <Echarts id="barChart" :options="barOptionData" @seriesClick="seriesClick"></Echarts>
      </div>
    </div>
    <div class="wdlx" v-show="checkTab == 'doc'">
      <div class="title">文档类型分布</div>
      <file-type-stat ref="fileTypeStat"></file-type-stat>
    </div>
    <a-row :gutter="16" style="margin-top: 16px">
      <a-col class="h-100" :span="24">
        <div class="wgnr" style="height: 100%">
          <div class="title" style="margin-bottom: 13px;">违规风险排行</div>
          <violate-content ref="violateContent"></violate-content>
        </div>
      </a-col>
      <!-- <a-col class="h-100" :span="12">
        <div class="wgnr">
          <div class="title" style="margin-bottom: 8px;height: auto">学院通过率情况</div>
          <college-rank ref="collegeRank"></college-rank>
        </div>
      </a-col> -->
    </a-row>
    <div class="wgnr wglx" style="margin-top: 14px">
      <div class="title" style="margin-bottom: 8px;">风险类型统计</div>
      <chart-tabs
        @selectTab="selectTypeTab"
        :tabList="[
          { key: 0, name: '文字情况' },
          { key: 1, name: '图片情况' },
        ]"
      ></chart-tabs>
      <violate-type class="margin-t-10" ref="violateType"></violate-type>
    </div>

    <div class="wgnr wglx" style="margin-top: 14px">
      <div class="title" style="margin-bottom: 8px;">用户使用情况
        <a @click="goUserDetail" style="position:absolute;right: 20px;font-size: small;">查看明细</a>
      </div>
      <user-situation class="margin-t-10" ref="userSituation"></user-situation>
    </div>

    <div class="wgnr wglx" style="margin-top: 14px">
      <div class="title" style="margin-bottom: 8px;">评价统计
      </div>
      <assess-stat class="margin-t-10" ref="assessStat"></assess-stat>
    </div>

    <div class="wgnr wglx" style="padding: 0 20px 18.5px 20px;">
      <div style="display:flex;align-items:center;font-size: 13px;">
        <img src="@/assets/img/icon.png" />
        <span style="margin-left: 4px;">智能识别引擎词库量：</span>
        <span style="color: rgb(69,137,251);">{{updateLog.lastTotalWords}}</span>&nbsp;条
        <span style="margin-left: 20px;">上次更新日期：</span>
        <span style="color: rgb(69,137,251);">{{updateLog.lastUpdateTime}}</span>
      </div>
    </div>

  </div>
</template>

<script>
import moment from "moment";
import myTreeSelect from '../components/myTreeSelect';
import { getOrgByUser } from '../../services/org';
import { list2Tree } from '../../utils/common';
import { cutStat } from '@/utils/util';
import { allList } from '@/services/applicationInfo.js';
import BigdataCard from './components/BigdataCard.vue';
import FileTypeStat from './components/FileTypeStat.vue';
import ChartTabs from './components/ChartTabs.vue';
import Echarts from '@/components/echarts/index';
import { exportBigdata, bigdataHeader, bigdataRank, bigdataUser, bigdataChart, bigdataAssessStat} from '@/services/bigdata.js';
import ViolateContent from './components/ViolateContent.vue';
// import CollegeRank from './components/CollegeRank.vue';
import ViolateType from './components/ViolateType.vue';
import UserSituation from './components/UserSituation.vue'
import {exportExcel, blobToJson} from '@/utils/util';
import {updateLog} from "../../services/bigdata";
import AssessStat from "./components/AssessStat.vue";
export default {
  name: 'Bigdata',
  components: {myTreeSelect, BigdataCard, ChartTabs, Echarts, FileTypeStat, ViolateContent, ViolateType, UserSituation, AssessStat},
  data() {
    return {
      updateLog:{
        lastTotalWords:0,
        lastUpdateTime:""
      },
      searchForm: {
        date: [],
        typeInfo: 0
      },
      exportLoading: false,
      orgTree: [],
      treeValue: undefined,
      appList: [],
      barOptionData: {
        tooltip: {
          trigger: 'item'
        },
        grid: {
          top: '4%',
          left: '5%',
          right: '2%',
          bottom: '26%'
        },
        xAxis: {
          type: 'category',
          data: [],
          axisTick: { show: false },
          axisLine: {
            lineStyle: {
              color: 'rgba(218, 225, 231, 0.51)'
            },
          },
          axisLabel: {
            color: '#A8B0C4',
            lineHeight: 30,
            rotate: 40,
            fontSize: 11
          }
        },
        yAxis: {
          type: 'value',
          axisLabel: {
            color: '#A8B0C4',
          }
        },
        series: [
          {
            data: [],
            type: 'bar',
            itemStyle: {
              color: '#618EFF',
            },
            barMinHeight: 1,
            barMaxWidth: 33,
          },
        ],
      },
      summaryStat: {
        textPercent: 0,
        imgPercent: 0,
        audioPercent: 0,
        videoPercent: 0,
        docPercent: 0,
      },
      headerStat: {},
      checkTab: 'text',
      checkTypeTab: 'text',
      textSelect: '1',
      imgSelect: '1',
      audioSelect: '1',
      videoSelect: '1',
      fileSelect:'1',
      monthArr: [],
      barType: 'month',
      dayArr: []
    };
  },
  computed: {},
  created() {
    this.getOrgAll();
    this.getApp();
    this.getHeaderData();
    this.getRankData();
    this.getChartData();
    this.getUpdateLog();
    this.getUserData()
    this.getAssessStatData()
    this.initX();

  },
  mounted () {},
  methods: {
    cutStat,
    initX(){
      if(this.searchForm.date.length === 0){
        //如果是日期x轴数据不变
        if(this.barType == 'month'){
          this.monthArr = [];
          for(let i = 11;i >= 0;i--){
            this.monthArr.push(moment(new Date()).subtract(i, 'month').format('YYYY-MM'))
          }
        }
      } else {
        this.monthArr = [];
        let start = moment(this.searchForm.date[0]).format('YYYY-MM');
        for(let i = 0;moment(start).add(i, 'month').isBefore(this.searchForm.date[1], 'day');i++){
          this.monthArr.push(moment(start).add(i, 'month').format('YYYY-MM'))
        }
      }

    },
    getUpdateLog() {
      updateLog().then((res) => {
        if (res.data.code === 0) {
          this.updateLog.lastTotalWords = res.data.data.lastTotalWords;
          this.updateLog.lastUpdateTime = res.data.data.lastUpdateTime;
        }
      });
    },
    getOrgAll() {
      getOrgByUser({isFilterSys:1}).then((res) => {
        if (res.data.code === 0) {
          this.orgTree = list2Tree(res.data.data);
        }
      });
    },
    selectChange(value) {
      this.searchForm.organId = value;
      this.treeValue = value;
    },
    getApp() {
      allList().then((res) => {
        if (res.data.code === 0) {
          this.appList = res.data.data;
        }
      });
    },
    getHeaderData(){
      bigdataHeader(this.searchForm).then(res => {
        if(res.data.code == 0){
          this.headerStat = res.data.data;
        }
      })
    },
    getChartData(queryMonth = undefined){
      bigdataChart({...this.searchForm, taskType: this.checkTab, queryMonth}).then(res => {
        if(res.data.code == 0){
          this.summaryStat = res.data.data;
          this.barOptionData.xAxis.data = this.monthArr;
          this.barOptionData.series[0].data = [];
          delete this.barOptionData.series[0].name;
          if(this.checkTab == 'text'){
            let textInfo = this.summaryStat.textInfo || {};
            if(this.textSelect == '1'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(textInfo[this.monthArr[i]] ? textInfo[this.monthArr[i]].taskCount : null)
              }
            } else if(this.textSelect == '2'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(textInfo[this.monthArr[i]] ? textInfo[this.monthArr[i]].textCount : null)
              }
            } else if(this.textSelect == '3'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(textInfo[this.monthArr[i]] ? textInfo[this.monthArr[i]].violationCount : null)
              }
            }
          } else if(this.checkTab == 'image'){
            let imgInfo = this.summaryStat.imgInfo || {};
            if(this.imgSelect == '1'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(imgInfo[this.monthArr[i]] ? imgInfo[this.monthArr[i]].taskCount : null)
              }
            } else if(this.imgSelect == '2'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(imgInfo[this.monthArr[i]] ? imgInfo[this.monthArr[i]].textCount : null)
              }
            } else if(this.imgSelect == '3'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(imgInfo[this.monthArr[i]] ? imgInfo[this.monthArr[i]].imgCount : null)
              }
            } else if(this.imgSelect == '4'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(imgInfo[this.monthArr[i]] ? imgInfo[this.monthArr[i]].violationCount : null)
              }
            }
          } else if(this.checkTab == 'audio'){
            let audioInfo = this.summaryStat.audioInfo || {};
            if(this.audioSelect == '1'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(audioInfo[this.monthArr[i]] ? audioInfo[this.monthArr[i]].taskCount : null)
              }
            } else if(this.audioSelect == '2'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(audioInfo[this.monthArr[i]] ? audioInfo[this.monthArr[i]].textCount : null)
              }
            } else if(this.audioSelect == '3'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(audioInfo[this.monthArr[i]] ? audioInfo[this.monthArr[i]].videoTime : null)
              }
            } else if(this.audioSelect == '4'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(audioInfo[this.monthArr[i]] ? audioInfo[this.monthArr[i]].violationCount : null)
              }
            }
          } else if(this.checkTab == 'video'){
            if(this.barOptionData.series.length === 2){
              this.barOptionData.series.pop();
            }
            delete this.barOptionData.legend;
            this.barOptionData.series[0].data = [];
            let videoInfo = this.summaryStat.videoInfo || {};
            if(this.videoSelect == '1'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].taskCount : null)
              }
            } else if(this.videoSelect == '2'){
              this.barOptionData.legend = {
                bottom: 0,
                icon: 'circle',
                itemWidth:3
              },
              this.barOptionData.series[0].name = '音频检测字数';
              this.barOptionData.series[1] = {
                name: '视频检测字数',
                data: [],
                type: 'bar',
                itemStyle: {
                  color: '#4d79e9',
                },
                barMinHeight: 1,
                barMaxWidth: 33,
              }
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].textCount : null);
                this.barOptionData.series[1].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].ocrCount : null);
              }
            } else if(this.videoSelect == '3'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].videoTime : null)
              }
            } else if(this.videoSelect == '4'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].violationCount : null)
              }
            }
          } else if(this.checkTab == 'doc'){
            this.barOptionData.series[0].data = [];
            let docInfo = this.summaryStat.docInfo || {}
            if(this.fileSelect == '1'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(docInfo[this.monthArr[i]] ? docInfo[this.monthArr[i]].taskCount : null)
              }
            } else if(this.fileSelect == '2'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(docInfo[this.monthArr[i]] ? docInfo[this.monthArr[i]].textCount : null)
              }
            } else if(this.fileSelect == '3'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(docInfo[this.monthArr[i]] ? docInfo[this.monthArr[i]].imgCount : null)
              }
            } else if(this.fileSelect == '4'){
              for(let i = 0;i < this.monthArr.length;i++){
                this.barOptionData.series[0].data.push(docInfo[this.monthArr[i]] ? docInfo[this.monthArr[i]].violationCount : null)
              }
            }
            this.$refs['fileTypeStat'].updateData({
              pdfTaskCount: this.summaryStat.pdfTaskCount,
              pdfWordsCount: this.summaryStat.pdfWordsCount,
              pdfOcrCount: this.summaryStat.pdfOcrCount,
              pdfImgCount: this.summaryStat.pdfImgCount,
              pdfViolationCount: this.summaryStat.pdfViolationCount,
              wordTaskCount: this.summaryStat.wordTaskCount,
              wordWordsCount: this.summaryStat.wordWordsCount,
              wordOcrCount: this.summaryStat.wordOcrCount,
              wordImgCount: this.summaryStat.wordImgCount,
              wordViolationCount: this.summaryStat.wordViolationCount,
              pptTaskCount: this.summaryStat.pptTaskCount,
              pptWordsCount: this.summaryStat.pptWordsCount,
              pptOcrCount: this.summaryStat.pptOcrCount,
              pptImgCount: this.summaryStat.pptImgCount,
              pptVideoCount: this.summaryStat.pptVideoCount,
              pptAudioCount: this.summaryStat.pptAudioCount,
              pptViolationCount: this.summaryStat.pptViolationCount,
            });
          }
          console.log(this.barOptionData);
        }
      })
    },
    getRankData(){
      bigdataRank(this.searchForm).then(res => {
        if(res.data.code == 0){
          const {data} = res.data;
          this.$refs.violateContent.createTable(data.violationInfoRankings);
          // this.$refs.collegeRank.createTable(data.collegePassingRankings);
          this.$refs.violateType.createTable(data.violationTypeRankings, data.violationTypeTop);
        }
      })
    },
    getUserData(){
      bigdataUser(this.searchForm).then(res => {
        if(res.data.code == 0){
          const {data} = res.data;
          this.$refs.userSituation.createTable(data);
        }
      })
    },
    getAssessStatData(){
      bigdataAssessStat(this.searchForm).then(res => {
        if(res.data.code == 0){
          const {data} = res.data;
          this.$refs.assessStat.createTable([data]);
        }
      })
    },
    getSearch(){
      if(this.searchForm.date.length > 0){
        this.searchForm.date[1] = moment(this.searchForm.date[1]).format('YYYY-MM-DD 23:59:59');
      }
      this.barType = 'month';
      this.getHeaderData();
      this.initX();
      this.getChartData();
      this.getRankData();
      this.getUserData()
      this.getAssessStatData()
    },
    exportData() {
      this.exportLoading = true;
      exportBigdata(this.searchForm).then(res => {
        if(res.data.type == 'application/json'){
          blobToJson(res.data).then(res => {
            if(res.code == 401){
              this.$message.warning('登录已失效，请重新登录');
              this.$router.replace({path: '/login'})
            } else {
              this.$message.error(res.message);
            }
          });
        } else {
          exportExcel(res.data, "数据中心.xlsx");
        }
      }).finally(() => {
         this.exportLoading = false;
      })
    },
    selectTab(val) {
      this.checkTab = val;
      if(this.checkTab == 'text'){
        this.textSelect = '1';
      } else if(this.checkTab == 'image'){
        this.imgSelect = '1';
      } else if(this.checkTab == 'audio'){
        this.audioSelect = '1';
      } else if(this.checkTab == 'video'){
        this.videoSelect = '1';
      } else if(this.checkTab == 'doc'){
        this.fileSelect = '1';
      }
      if(this.barOptionData.series.length === 2){
        this.barOptionData.series.pop();
      }
      delete this.barOptionData.legend;
      this.barType = 'month';
      this.initX();
      this.getChartData();
    },
    selectTypeTab(val){
      this.searchForm.typeInfo = val;
      this.getRankData();
    },
    typeChange(val){
      this.initX();
      delete this.barOptionData.series[0].name;
      if(this.checkTab == 'text'){
        this.barOptionData.series[0].data = [];
        let textInfo = this.summaryStat.textInfo || {};
        if(val == '1'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(textInfo[this.monthArr[i]] ? textInfo[this.monthArr[i]].taskCount : null)
          }
        } else if(val == '2'){
          console.log(this.monthArr);
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(textInfo[this.monthArr[i]] ? textInfo[this.monthArr[i]].textCount : null)
          }
        } else if(val == '3'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(textInfo[this.monthArr[i]] ? textInfo[this.monthArr[i]].violationCount : null)
          }
        }
      } else if(this.checkTab == 'image'){
        this.barOptionData.series[0].data = [];
        let imgInfo = this.summaryStat.imgInfo || {};
        if(val == '1'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(imgInfo[this.monthArr[i]] ? imgInfo[this.monthArr[i]].taskCount : null)
          }
        } else if(val == '2'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(imgInfo[this.monthArr[i]] ? imgInfo[this.monthArr[i]].textCount : null)
          }
        } else if(val == '3'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(imgInfo[this.monthArr[i]] ? imgInfo[this.monthArr[i]].imgCount : null)
          }
        } else if(val == '4'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(imgInfo[this.monthArr[i]] ? imgInfo[this.monthArr[i]].violationCount : null)
          }
        }
      } else if(this.checkTab == 'audio'){
        this.barOptionData.series[0].data = [];
        let audioInfo = this.summaryStat.audioInfo || {};
        if(val == '1'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(audioInfo[this.monthArr[i]] ? audioInfo[this.monthArr[i]].taskCount : null)
          }
        } else if(val == '2'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(audioInfo[this.monthArr[i]] ? audioInfo[this.monthArr[i]].textCount : null)
          }
        } else if(val == '3'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(audioInfo[this.monthArr[i]] ? audioInfo[this.monthArr[i]].videoTime : null)
          }
        } else if(val == '4'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(audioInfo[this.monthArr[i]] ? audioInfo[this.monthArr[i]].violationCount : null)
          }
        }
      } else if(this.checkTab == 'video'){
        if(this.barOptionData.series.length === 2){
          this.barOptionData.series.pop();
        }
        delete this.barOptionData.legend;
        this.barOptionData.series[0].data = [];
        let videoInfo = this.summaryStat.videoInfo || {};
        if(val == '1'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].taskCount : null)
          }
        } else if(val == '2'){
          this.barOptionData.legend = {
            bottom: 0,
            icon: 'circle',
            itemWidth:3
          },
          this.barOptionData.series[0].name = '音频检测字数';
          this.barOptionData.series[1] = {
            name: '视频检测字数',
            data: [],
            type: 'bar',
            itemStyle: {
              color: '#4d79e9',
            },
            barMinHeight: 1,
            barMaxWidth: 33,
          }
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].textCount : null);
            this.barOptionData.series[1].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].ocrCount : null);
          }
        } else if(val == '3'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].videoTime : null)
          }
        } else if(val == '4'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(videoInfo[this.monthArr[i]] ? videoInfo[this.monthArr[i]].violationCount : null)
          }
        }
      } else if(this.checkTab == 'doc'){
        this.barOptionData.series[0].data = [];
        let docInfo = this.summaryStat.docInfo || {};
        if(val == '1'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(docInfo[this.monthArr[i]] ? docInfo[this.monthArr[i]].taskCount : null)
          }
        } else if(val == '2'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(docInfo[this.monthArr[i]] ? docInfo[this.monthArr[i]].textCount : null)
          }
        } else if(val == '3'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(docInfo[this.monthArr[i]] ? docInfo[this.monthArr[i]].imgCount : null)
          }
        } else if(val == '4'){
          for(let i = 0;i < this.monthArr.length;i++){
            this.barOptionData.series[0].data.push(docInfo[this.monthArr[i]] ? docInfo[this.monthArr[i]].violationCount : null)
          }
        }
      }
    },
    seriesClick(params){
      if(this.barType == 'month'){
        this.barType = 'day';
        let dayCount = moment(params.name, "YYYY-MM").daysInMonth();
        this.monthArr = [];
        for(let i = 0;i < dayCount;i++){
          this.monthArr.push(moment(params.name).add(i, 'day').format('YYYY-MM-DD'))
        }
        this.getChartData(params.name);
      }
    },
    backToMonth(){
      if(this.barType == 'day'){
        this.barType = 'month';
        this.initX();
        this.getChartData();
      }
    },
    goUserDetail(){
      if(this.searchForm.date.length > 0){
        this.searchForm.date[1] = moment(this.searchForm.date[1]).format('YYYY-MM-DD 23:59:59');
      }
      this.$router.push({
        path: "userSituationDetail",
        query: this.searchForm
      }
      );
    }
  },
};
</script>

<style lang="less" scoped>
.filter-bar {
  padding: 18px 20px;
  background-color: #fff;
  display: flex;
  justify-content: space-between;
  .orgSelect {
    width: 180px;
  }
}
.shtj {
  padding: 12px 20px;
  background-color: #fff;
  border-radius: 6px;
  // margin-top: 15px;
  .shtj-header {
    display: flex;
    height: 28px;
    align-items: center;
  }
  .shtj-middle {
    margin-top: 16px;
    margin-bottom: 16px;
    padding-left: 14px;
    height: 30px;
    display: flex;
    justify-content: space-between;
    .name {
      color: #7b859b;
      font-size: 13px;
    }
    .count {
      color: #4278FF;
      font-size: 13px;
      font-weight: bold;
    }
    // /deep/ .ant-select-selection{
    //   height: 32px;
    //   line-height: 32px;
    // }
  }
  .shtj-chart {
    width: 100%;
    height: 270px;
  }
}
.wdlx{
  padding: 20px 33px 20px 20px;
  background-color: #fff;
  border-radius: 6px;
  /* margin-top: 15px; */
}
.title {
  height: 13px;
  display: flex;
  align-items: center;
  border-left: 4px solid #D43A3A;
  color: #000;
  font-size: 17px;
  padding-left: 10px;
  font-weight: bold;
}
.wgnr{
  padding: 18.5px 20px 18.5px 20px;
  background-color: #fff;
  border-radius: 6px;
}
.wglx /deep/ .ant-table-row:last-of-type{
  position: sticky;
  bottom: 0;
  background: #fff;
}
</style>
